<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>尺寸属性</title>
		<style>
			sp an{
				font-size: 10em;
				color: rgba(200,1,150,.1);
			}
			/* 尺寸属性：最大宽度与最小宽度，功能：【屏幕】自适应
			
			*/
		   div.container{
			   background-color: #aaffff;
		   }
		   div.box{
			   background-color: #c4c650;
			   /* 设置宽度：80% */
			   width:80%;
			 /* 最大宽度属性：页面最大宽度值，如果与width同时出现，以最大宽度值 */
			   ma x-width: 600px;
			 /* 最小宽度属性：页面最小宽度值，达到最小值，页面内容不会被压缩
			    宽度与最小宽度同时出现，宽度大于最小宽度，宽度值以打的为准
				宽度与最大宽度和最小宽度同时出现，宽度>最大宽度>最小宽度，宽度值以大的为准
			  */
			   min-width:500px;
		   }
		</style>
	</head>
	<body>
		<div class="container">
			<div class="box">Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut quas porro beatae assumenda sint ea aspernatur iusto placeat vel! Quae, similique beatae obcaecati sed iusto quod repellat voluptatum voluptate adipisci?</div>
		</div>
		<!-- 常用样式单位
		   1.针对尺寸：%，px 绝对值 像素，em 移动端 针对字体
		   2.针对颜色:网页三原色：红，绿，蓝，组成页面的任意颜色
		   rgba(0~255,0~255,0~255,0~1)
		   十六进制写法：#rrggbb   0~9 a~z A~Z  常用：#000000  #ffffff
		   简写：#000  #fff
		 -->
		 <span>lorem</span>
	</body>
</html>